import React from 'react';
import "./UserHeader.css";
import "../../Common/css/common.css";

import UserServer from "../../Server/User";
import UserCheck from "../../utils/UserCheck";
import HttpUtil from "../../utils/HttpUtil";

export default class UserHeader extends React.Component{
    constructor (props){
      super();
      
      this.state={
            linkData:props.links,
            logo:props.logoSrc,
            logoLink:props.logoLink,
            portrait:"",
            portraitLink:props.portraitLink,
            activeID:props.activeID,
            notHome:props.notHome==="true"
        };
        let userID=UserCheck.GetUserID(true);

        if(userID!==""){
            UserServer.SelectUserInformation(userID)
            .then(response=>{
                // console.log(response);
                let userHeader=HttpUtil.GetResourceURL(response.data.userHeadUrl);
                // console.log(userHeader);
                
                this.setState({
                    portrait:userHeader
                });
            });
        }
    }
    
    render(){
        //渲染标题
        let menu=[];
        let key=0;
        for(let i=0;i<this.state.linkData.length;i++){
            // console.log(this.state.linkData[i][0]);
            let text=this.state.linkData[i][0];
            let url=this.state.linkData[i][1];
            if(i===this.state.activeID){
                menu.push(<span key={key++} className="UserHeaderTextActive UserHeaderTextActiveBorder"><a href={url}>{text}</a></span>);
            }
            else{
                menu.push(<span key={key++}><a href={url}>{text}</a></span>);
            }
        }
        // console.log(this.state.notHome)
        if(this.state.notHome){
            //头像
            menu.push(<span key={key++}><a href={this.state.portraitLink}><img  alt="portrait" src={this.state.portrait} className="UserHeader_Protrait"/></a></span>);
        }
        else{
        // console.log(this.state.portrait!=="")

            if(this.state.portrait!==""){
                menu.push(<span key={key++}><a href={this.state.portraitLink}><img  alt="portrait" src={this.state.portrait} className="UserHeader_Protrait"/></a></span>);
            }
            else{
                menu.push(<span key={key++}><a href={this.state.portraitLink} >登录</a></span>);
            }
        }
        return (
            <div >
                <div className={!this.state.notHome?"UserHeaderText":"UserHeaderTextLayout UserHeaderText"}>
                    <div className="UserHeader_Main">
                        <div className="UserHeaderTextLayout_Left ">
                                <a href={this.state.logoLink}>
                                    <img src={this.state.logo}  className="UserHeader_Logo" alt="logo"/> 可派网络无人机服务平台</a>
                        </div>
                        <div className="UserHeaderTextLayout_Right ">
                            <div >
                                <div className="UserHeaderText_Flex ">
                                    {menu}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}